<!doctype html>
<html id="<%= id %>">
  <head>
    <meta charset="utf-8">
    <meta content="ie=edge" http-equiv="x-ua-compatible">
    <meta content="width=device-width,initial-scale=1" name="viewport">
    <meta content="livingstyleguide.org <%= LivingStyleGuide::VERSION %>" name="generator">
    <title><%= ERB::Util.h(title) %></title>
    <script>
      <%= javascript %>
    </script>
    <style>
      <%= css %>
    </style>
    <%= head %>
  </head>
  <body class="lsg">
    <%= header %>
    <% unless before.empty? %>
      <section class="lsg-before">
        <%= before %>
      </section>
    <% end %>
    <article class="lsg-container">
      <%= html %>
    </article>
    <% unless after.empty? %>
      <section class="lsg-after">
        <%= after %>
      </section>
    <% end %>
    <%= footer %>
    <%= logo %>
  </body>
</html>
